<template>
  <el-table-column
    v-if="col && col.child && col.child.length"
    v-bind="col.prop"
    class-name="z-tr-col"
  >
    <z-col v-for="it in col.child" :col="it" :key="it.id"></z-col>
  </el-table-column>
  <el-table-column
    v-else-if="col && col.type"
    v-bind="col.prop"
    class-name="z-tr-col"
  >
    <template #default="scope">
      <col-com
        :key="col.prop.prop + '-' + scope.row[mainId]"
        :col-id="col.prop.prop"
        :model-value="scope.row[col.prop.prop]"
        :row-index="scope.$index + 1"
        v-bind="col"
        @update:modelValue="setVal(scope.row, col.prop.prop, $event)"
      />
    </template>
  </el-table-column>
  <el-table-column v-else v-bind="col.prop" class-name="z-tr-col" />
</template>
<script lang="ts" setup>
import { colProps } from "./col";
import colCom from "../colCom/index.vue";
import { useCol } from "./use";
defineOptions({
  name: "z-col",
});
const props = defineProps(colProps);
const { setVal } = useCol(props);
// defineExpose({
//   ref: _ref,
// });
</script>
